<template>
  <view class="page-container">
    <view class="user-profile">
      <image class="avatar"  :src="useCounter.UserInfo?.avatar" mode=""></image>
      <text class="username">{{ useCounter.UserInfo?.name}}</text>
      <text class="no">司机编号：{{ useCounter.UserInfo?.number }}</text>
      <text class="mobile">手机号码：{{ useCounter.UserInfo?.phone  }}</text>
    </view>
    <view class="month-overview">
      <view class="title">我的任务</view>
      <view class="content">
        <view class="item">
          <text class="volumn">{{ myTask.taskAmounts }}</text>
          <text class="label">任务总量</text>
        </view>
        <view class="item">
          <text class="volumn">{{ myTask.completedAmounts }}</text>
          <text class="label">完成任务量</text>
        </view>
        <view class="item">
          <text class="volumn">{{ myTask.transportMileage }}</text>
          <text class="label">运输里程(km)</text>
        </view>
      </view>
    </view>
    <view class="entry-list">
      <uni-list :border="false">
        <uni-list-item
          to="/subpkg_user/truck/index"
          showArrow
          title="车辆信息"
        />
        <uni-list-item
          to="/subpkg_user/task/index"
          showArrow
          title="任务数据"
        />
        <uni-list-item
          to="/subpkg_user/settings/index"
          showArrow
          title="系统设置"
        />
      </uni-list>
    </view>
  </view>
</template>

<script setup>
  import { onLoad } from '@dcloudio/uni-app'
  import { useCounterStore } from '@/stores/index'
  import { getUserInfo ,getUsersTaskReport} from './api'
  import { ref, onMounted } from 'vue'
  const myTask = ref({})

  const currentDate = new Date()
  const currentYear = currentDate.getFullYear(); // 获取当前年份
  const currentMonth = currentDate.getMonth() + 1; // 获取当前月份
  const current = ref({month: currentMonth,year: currentYear})

  const useCounter = useCounterStore()
  onLoad(async () => { // 获取用户信息，储存到大菠萝
    const res = await getUserInfo()
    useCounter.UserInfo = res.data
    const result = await getUsersTaskReport(current.value) // 获取任务数据
    myTask.value = result.data
  })
</script>

<style lang="scss" scoped>
  @import './index.scss';
</style>
